<template>
	<view class="container">
		<custom-tarbar :selected="0"></custom-tarbar>
		<view class="home">
			<view class="uli" @click="next(item.id)" v-for="(item, idx) in activityList" :key="idx">
				<image :src="item.cover" class="logo"></image>
				<view class="content">
					<view class="title">{{ item.title }}</view>
					<view class="date">报名日期 {{ item.start_date }} 至 {{ item.end_date }}</view>
					<!-- <view class="date"></view>
					<view class="date">至</view>
					<view class="date"></view> -->
					<view class="content-flex">
						<view class="number">{{ item.add_count }}人报名</view>
						<view class="status greenColor">{{ item.textState }}</view>
					</view>
				</view>
			</view>
			

		</view>
	</view>
</template>

<script>
import customTarbar from '@/compontents/custom-tarbar.vue';
import { activityList, post } from '@/utils/interface.js';
export default {
	components: {
		'custom-tarbar': customTarbar
	},
	data() {
		return {
			activityList: [],
			textState: '',
			page: '1'
		};
	},
	methods: {
		next(id) {
			uni.navigateTo({
				url: '/pages/sign/sign-up?id=' + id
			});
		},
		// 获取活动列表
		getActivityList() {
			let nowData = new Date().getTime();
			activityList({ method: 'activities.activities', show: '1', page: this.page, limit: '10' }).then(res => {
				if (res.data.list.length) {
					res.data.list.map(item => {
						let start = Date.parse(new Date(item.start_date));
						let end = Date.parse(new Date(item.end_date));
						if (nowData < start) {
							item.textState = '未开始';
						} else if (nowData > end) {
							item.textState = '已结束';
						} else {
							item.textState = '进行中';
						}
						this.activityList.push(item);
					});
				}
			});
		},
		// 模拟登陆 假数据
		
		getNowFormatDate() {
			var date = new Date();
			var seperator1 = '-';
			var year = date.getFullYear();
			var month = date.getMonth() + 1;
			var hour = date.getHours();
			var minutes = date.getMinutes();
			var seconds = date.getSeconds();
			var strDate = date.getDate();
			if (month >= 1 && month <= 9) {
				month = '0' + month;
			}
			if (strDate >= 0 && strDate <= 9) {
				strDate = '0' + strDate;
			}
			var currentdate = year + seperator1 + month + seperator1 + strDate + '  ' + hour + ':' + minutes + ':' + seconds;
			return currentdate;
		},
		getUrlParams(name) {
		      // 不传name返回所有值，否则返回对应值
		      var url = window.location.search;
			  console.log(url)
		      if (url.indexOf("?") == 1) {
		        return false;
		      }
		      url = url.substr(1);
		      url = url.split("&");
		      var name = name || "";
		      var nameres;
		      // 获取全部参数及其值
		      for (var i = 0; i < url.length; i++) {
		        var info = url[i].split("=");
		        var obj = {};
		        obj[info[0]] = decodeURI(info[1]);
		        url[i] = obj;
		      }
		      // 如果传入一个参数名称，就匹配其值
		      if (name) {
		        for (var i = 0; i < url.length; i++) {
		          for (const key in url[i]) {
		            if (key == name) {
		              nameres = url[i][key];
		            }
		          }
		        }
		      } else {
		        nameres = url;
		      }
		      // 返回结果
		      return nameres;
		    }
	},
	onReachBottom() {
		this.page++;
		this.getActivityList();
		console.log('触底2');
	},
	onLoad() {
		
		if(!uni.getStorageSync('userToken')){
			if(this.getUrlParams("code")){
				post({method:"user.officiallogin",code:this.getUrlParams("code"),type:this.getUrlParams("type"),state:this.getUrlParams("state")}).then(res=>{
					uni.setStorageSync('userToken',res.data.token)
				})
			}else{
				post({method:"user.gettrustlogin",url:"http://jy.yuxwl.cn/h5/"}).then(res=>{
					window.location.href = res.data.Wxofficial
				})
			}
		}
		this.getActivityList();
		
		
	}
};
</script>

<style>
.content {
	flex: 1;
}
.home {
	background-color: #f9fcff;
	padding-bottom: 30px;
	min-height: 100vh;
	padding-top: 15px;
}
.uli {
	width: 660upx;
	height: 240upx;
	background: #fff;
	display: flex;
	align-items: center;
	padding: 0 20upx;
	margin: 0 auto 15px;
	box-shadow: 0px 0px 2px 0px rgba(212, 245, 221, 0.2);
	border-radius: 6px 6px 6px 6px;
}
.uli .logo {
	width: 260upx;
	height: 187upx;
	margin-right: 20upx;
}
.content {
	/* height: 187upx; */
}
.title {
	color: #111111;
	font-size: 28upx;
	margin-bottom: 10upx;
	line-height: 60upx;
}
.date {
	font-size: 20upx;
	color: #111111;
	line-height: 30upx;
}
.date:nth-of-type(3) {
	color: #494949;
}
.content-flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.content-flex view {
	line-height: 60upx;
}
.number {
	font-size: 28upx;
	color: #111111;
}
.status {
	font-size: 20upx;
}
.greenColor {
	color: #00ff0c;
}

</style>
